<template>
  <div>
    <Dialog
      ref="Drawer"
      @close="close"
      :loading="loading"
      @handleSave="handleSave"
      :disabled="disabled"
      title="角色分配"
      :dialog="dialog"
    >
      <template #content>
        <el-form
          :disabled="disabled"
          :model="ruleForm"
          size="small"
          :rules="rules"
          ref="ruleForm"
          label-width="100px"
          class="demo-ruleForm"
        >
          <el-form-item
            label="角色名称"
            prop="roleIds"
          >
            <el-select
              class="w100p"
              v-model="ruleForm.roleIds"
              placeholder="请选择角色名称"
            >
              <el-option
                v-for="item in options"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </template>
    </Dialog>
  </div>
</template>
<script>
import Dialog from "@/components/Dialog";
import * as settingApi from "@/api/setting1";
export default {
  components: {
    Dialog,
  },
  data() {
    return {
      dialog: false, //弹框
      rules: {
        //form表单非空校验
        roleIds: [
          {
            required: true,
            message: "请选择角色名称",
            trigger: "change",
          },
        ],
      },
      ruleForm: {
        //表单提交
        roleIds: "",
        userId: "",
      },
      formLabelWidth: "100px", //表单label宽度
      loading: false, //表单提交按钮
      disabled: false,
      title: "",
      options: [], //角色列表
    };
  },
  methods: {
    //弹框关闭
    close() {
      this.dialog = false;
    },
    //获取角色列表
    handleGetRoleList() {
      let params = {
        isPage: false,
        sysFlag: "hospital",
      };
      settingApi.roleList(params).then((res) => {
        if (res && res.success) {
          this.options = res.data;
          this.handleUserRelevanceRole();
        }
      });
    },
    //获取用户关联角色
    handleUserRelevanceRole() {
      settingApi.getListByUserId(this.ruleForm.userId).then((res) => {
        if (res && res.success) {
          if (res.data) {
            this.ruleForm.roleIds = res.data[res.data.length - 1].id;
          }
        }
      });
    },
    //初始化弹框
    showModal(_type, _row) {
      this.dialog = true;
      this.$nextTick((_) => {
        this.$refs.ruleForm.resetFields();
        this.ruleForm.userId = _row.adminId;
        this.handleGetRoleList();
      });
    },
    //提交保存
    handleSave() {
      this.loading = true;
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          settingApi
            .roleConcatUser(this.ruleForm)
            .then((res) => {
              if (res && res.success) {
                this.loading = false;
                this.dialog = false;
                this.$emit("getDataList");
              } else {
                this.loading = false;
              }
            })
            .catch((e) => {
              this.loading = false;
            });
        } else {
          this.loading = false;
        }
      });
    },
  },
};
</script>
